import 'package:awesome_project/route/app_router.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_hooks/flutter_hooks.dart';

import '../models/export_models.dart';
import '../utils/utils.dart';

class ThreeSelectorWidget extends StatelessWidget {
  final int? index1, index2, index3;
  final Function(int, int, int, List<CityModel>)? onChange;

  const ThreeSelectorWidget(
      {super.key, this.index1, this.index2, this.index3, this.onChange});

  @override
  Widget build(BuildContext context) {
    return FutureBuilder(
        future: Utils.getCityModelS(),
        builder: (context, snapshot) {
          final cityS = snapshot.data ?? [];
          if (cityS.isEmpty) {
            return const Text("loading");
          }
          return HookBuilder(builder: (context) {
            final getList = useCallback((int index, List<CityModel> items) {
              if (index >= items.length) {
                return <CityModel>[];
              } else {
                return items[index].children;
              }
            }, []);

            final controller =
                useRef(FixedExtentScrollController(initialItem: index1 ?? 0));
            final controller2 =
                useRef(FixedExtentScrollController(initialItem: index2 ?? 0));
            final controller3 =
                useRef(FixedExtentScrollController(initialItem: index3 ?? 0));

            final items2 = useValueNotifier(cityS[index1 ?? 0].children);
            final items3 = useValueNotifier(
                cityS[index1 ?? 0].children[index2 ?? 0].children);

            useEffect(() {
              return () {
                controller.value.dispose();
                controller2.value.dispose();
              };
            }, [6]);
            return Column(
              children: [
                SizedBox(
                  child: Row(
                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
                    children: [
                      TextButton(
                          onPressed: () {
                            appRouter.pop();
                          },
                          child: Text("取消")),
                      TextButton(
                          onPressed: () {
                            onChange?.call(
                                controller.value.selectedItem,
                                controller2.value.selectedItem,
                                controller3.value.selectedItem,
                                cityS);
                            appRouter.pop();
                          },
                          child: Text("确定")),
                    ],
                  ),
                ),
                Expanded(
                  child: Row(
                    children: [
                      Expanded(
                          child: MyListWheelScrollView(
                        controller: controller.value,
                        onSelectedItemChanged: (position) {
                          items2.value = cityS[position].children;
                          items3.value = getList(0, items2.value);
                        },
                        items3: cityS,
                      )),
                      Expanded(
                          child: ValueListenableBuilder(
                        builder: (context, value, child) {
                          return MyListWheelScrollView(
                            controller: controller2.value,
                            onSelectedItemChanged: (position) {
                              items3.value = getList(position, items2.value);
                            },
                            items3: value,
                          );
                        },
                        valueListenable: items2,
                      )),
                      Expanded(
                          child: ValueListenableBuilder(
                        builder: (context, value, child) {
                          return MyListWheelScrollView(
                            controller: controller3.value,
                            onSelectedItemChanged: (position) {},
                            items3: value,
                          );
                        },
                        valueListenable: items3,
                      )),
                    ],
                  ),
                ),
              ],
            );
          });
        });
  }
}

class TwoSelectorWidget extends StatelessWidget {
  final int? index1, index2;
  final Function(int, int, List<CityModel>)? onChange;

  const TwoSelectorWidget({super.key, this.index1, this.index2, this.onChange});

  @override
  Widget build(BuildContext context) {
    return FutureBuilder(
        future: Utils.getCityModelS(),
        builder: (context, snapshot) {
          final cityS = snapshot.data ?? [];
          if (cityS.isEmpty) {
            return const Text("loading");
          }
          return HookBuilder(builder: (context) {
            final getList = useCallback((int index, List<CityModel> items) {
              if (index >= items.length) {
                return <CityModel>[];
              } else {
                return items[index].children;
              }
            }, []);

            final controller =
                useRef(FixedExtentScrollController(initialItem: index1 ?? 0));
            final controller2 =
                useRef(FixedExtentScrollController(initialItem: index2 ?? 0));

            final items2 = useValueNotifier(cityS[index1 ?? 0].children);
            final items3 = useValueNotifier(
                cityS[index1 ?? 0].children[index2 ?? 0].children);

            useEffect(() {
              return () {
                controller.value.dispose();
                controller2.value.dispose();
              };
            }, [6]);
            return Column(
              children: [
                SizedBox(
                  child: Row(
                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
                    children: [
                      TextButton(
                          onPressed: () {
                            appRouter.pop();
                          },
                          child: Text("取消")),
                      TextButton(
                          onPressed: () {
                            onChange?.call(controller.value.selectedItem,
                                controller2.value.selectedItem, cityS);
                            appRouter.pop();
                          },
                          child: Text("确定")),
                    ],
                  ),
                ),
                Expanded(
                  child: Row(
                    children: [
                      Expanded(
                          child: MyListWheelScrollView(
                        controller: controller.value,
                        onSelectedItemChanged: (position) {
                          items2.value = cityS[position].children;
                          items3.value = getList(0, items2.value);
                        },
                        items3: cityS,
                      )),
                      Expanded(
                          child: ValueListenableBuilder(
                        builder: (context, value, child) {
                          return MyListWheelScrollView(
                            controller: controller2.value,
                            onSelectedItemChanged: (position) {
                              items3.value = getList(position, items2.value);
                            },
                            items3: value,
                          );
                        },
                        valueListenable: items2,
                      )),
                    ],
                  ),
                ),
              ],
            );
          });
        });
  }
}

class MyListWheelScrollView extends StatelessWidget {
  final FixedExtentScrollController controller;
  final List<CityModel> items3;
  final ValueChanged<int>? onSelectedItemChanged;

  const MyListWheelScrollView(
      {super.key,
      required this.controller,
      required this.items3,
      this.onSelectedItemChanged});

  @override
  Widget build(BuildContext context) {
    return CupertinoPicker(
      offAxisFraction: 0,
      magnification: 1.2,
      scrollController: controller,
      itemExtent: 30,
      onSelectedItemChanged: onSelectedItemChanged,
      children: items3.map((e) => Text(e.name)).toList(),
    );
  }
}
